<!DOCTYPE html>
<html lang="zh-CN">
<head>
    <meta charset="utf-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0, user-scalable=no">
    <title>管理收货地址</title>
    <meta name="keywords" content="">
    <meta name="description" content="">
    <script src="js/rem.js"></script> 
    <script src="js/jquery.min.js" type="text/javascript"></script>
    <link rel="stylesheet" type="text/css" href="css/base.css"/>
    <link rel="stylesheet" type="text/css" href="css/page.css"/>
    <link rel="stylesheet" type="text/css" href="css/all.css"/>
    <link rel="stylesheet" type="text/css" href="css/mui.min.css"/>
    <link rel="stylesheet" type="text/css" href="css/loaders.min.css"/>
    <link rel="stylesheet" type="text/css" href="css/loading.css"/>
<script type="text/javascript">
	$(window).load(function(){
		$(".loading").addClass("loader-chanage")
		$(".loading").fadeOut(300)
	})
</script>
</head>
<!--loading页开始-->
<div class="loading">
	<div class="loader">
        <div class="loader-inner pacman">
          <div></div>
          <div></div>
          <div></div>
          <div></div>
          <div></div>
        </div>
	</div>
</div>
<!--loading页结束-->
	<body>
		<header class="mui-bar mui-bar-nav report-header box-s" id="header">
			<a href="center.html"><i class="iconfont icon-fanhui fl"></i></a>
			<p>管理收货地址</p>
	    </header>
	    <div id="main" class="mui-clearfix contaniner">
			
			
			
	    	<div class="addlist clearfloat" id='tbody'>
				<div v-for="addr in addrs" >
					<div class="bottom clearfloat box-s">
						<section class="shopcar clearfloat">
						
							<template v-if="addr.isDefault == 1">
							<div class="radio fl"> 
							    <label>
							        <input type="radio" name='def_address' value="" :aid="addr.aid" v-on:click="setDefault"
								checked="true" />
							        <div class="option"></div>
							        <span class="mradd smradd fl">设为默认</span>
							    </label>
							</div>
							</template>
							<template v-else>
						<div class="radio fl">
						    <label>
						        <input type="radio" name='def_address' value="" :aid="addr.aid" v-on:click="setDefault"
							 />
						        <div class="option"></div>
						        <span class="mradd smradd fl">设为默认</span>
						    </label>
						</div>
							</template>
							
							<div class="right fr clearfloat">
								<a href="#" class="fr" :aid="addr.aid" v-on:click="deleteFN">
									<i class="iconfont icon-lajixiang"></i>
									删除
								</a>
						<!-- 		<a href="#" class="fr">
									<i class="iconfont icon-shouji"></i>
									编辑
								</a> -->							
							</div>
						</section>
					</div>
	    		<div class="top clearfloat box-s"   >
	    			<ul>
	    				<li>
	    					<span class="fl">{{addr.name}}</span>
	    					<span class="fr">{{addr.phone}}</span>
	    				</li>
	    				<li>
	    					{{addr.provinceName}}{{addr.cityName}}{{addr.areaName}}{{addr.address}}
	    				</li>
	    			</ul>
	    		</div>

	    	</div>
	    	</div>
	    	<!-- <div class="addlist clearfloat">
	    		<div class="top clearfloat box-s">
	    			<ul>
	    				<li>
	    					<span class="fl">孙瑾晨</span>
	    					<span class="fr">1303505****</span>
	    				</li>
	    				<li>
	    					安徽省合肥市蜀山区高新技术产业开发区合肥市高新区长江西路拓基城市广场金座A幢2002
	    				</li>
	    			</ul>
	    		</div>
	    		<div class="bottom clearfloat box-s">
	    			<section class="shopcar clearfloat">
						<div class="radio fl"> 
						    <label>
						        <input type="radio" name="sex" value="">
						        <div class="option"></div>
						        <span class="mradd smradd fl">设为默认</span>
						    </label>
						</div>
						
						<div class="right fr clearfloat">
							<a href="#" class="fr">
								<i class="iconfont icon-lajixiang"></i>
								删除
							</a>
							<a href="#" class="fr">
								<i class="iconfont icon-shouji"></i>
								编辑
							</a>							
						</div>
					</section>
	    		</div>
	    	</div> -->
	    	
	    </div>
	    
     	<a href="add-address.html" class="address-add fl">
     		添加新地址
     	</a>
		
		
		
	</body>
	<script type="text/javascript" src="js/jquery-1.8.3.min.js" ></script>
	<!-- <script src="js/fastclick.js"></script> -->
	<script src="js/mui.min.js"></script>
	<script type="text/javascript" src="js/hmt.js" ></script>
	<script src="./js/vue.js"></script>
		<script type="text/javascript">
			var addressListUrl=baseUrl+ "/zuul-address/addresses/list";
			var obj=new Vue({
				el: '#tbody',
				data: {
					addrs: []
				},
				methods: {
					setDefault: function (event) {
						var obj =  event.target;
						var aid=$(obj).attr("aid");
						// 发送AJAX请求设置默认地址
						var setDefaultUrl=baseUrl+ "/zuul-address/addresses/"+aid+"/set_default";
					
						data={aid:aid,
							uid:localStorage.getItem('uid'),
							username:localStorage.getItem('username')},
						$.post(setDefaultUrl,data,function(result){
							if(result.state==1000){
								alert("默认地址设置成功");
								// 刷新地址数据
								listAddr();
								location.reload();
							}else{
								alert(result.msg);
							}
						});
					},
					deleteFN: function (event) {
						var flag=confirm("是否删除该地址");
						if(flag==false){ // 取消
							return;
						}
						var obj =  event.target;
						var aid=$(obj).attr("aid");
						data={aid:aid,
							uid:localStorage.getItem('uid'),
							username:localStorage.getItem('username')
						};
						// 发送AJAX请求设置默认地址
						var deleteUrl=baseUrl+ "/zuul-address/addresses/"+aid+"/delete";
						$.post(deleteUrl,data,function(result){
							if(result.state==1000){
								alert("删除地址成功");
								// 刷新地址数据
								listAddr();
							}else{
								alert(result.msg);
							}
						});
					}
				}
			});
	
			$(function () {
				listAddr();
			});
	
			function listAddr(){
				$.post(addressListUrl,{uid:localStorage.getItem('uid')},function(result){
					if(result.state==1000){
						obj.addrs=result.data;
						
					}else{
						alert(result.msg);
					}
				});
			}
		</script>
</html>
